#@layer()

#define css()
<style>
    .jp-group{
        align-items: center;
    }
    .jp-group p{
        color:#666;
    }

    .jp-block{
        padding-top: 10px;
    }
    .attachment-panel img{
        border-radius: 5px;

    }
</style>
#end

#define script()
<script>

    $(document).ready(function () {
        var height = $(document).height();
        $("#image-card").css("height", height + "px");
        $("#image-card").css("min-height", height + "px");
        $("#image-info").css("height", height + "px");
        $("#image-info").css("min-height", height + "px");
        $("img").css("max-height", height + "px");
    });

    function del(id) {
        if (confirm("确定要删除该附件吗？删除后不可恢复")) {
            ajaxGet("#(CPATH)/admin/attachment/doDel/" + id, function () {
                parent.layer.data.needReload = true;
                parent.layer.closeAll();
            })
        }
    }

    function update() {
        ajaxSubmit("#form", function () {
            toastr.success('修改成功');
        })
    }
</script>
#end

#define content()

<div class="row attachment-main" style="padding:20px;margin:0;">
    <div class="col-5" id="image-card">
        <div class="row attachment-panel">

            #if(attachment.isImage())
            <img src="#(CPATH)#(attachment.path ??)" style="width: 100%">
            #elseif(attachment.isDoc())
            <img src="#(CPATH)/static/commons/img/suffix/doc.png" style="width: 100%">
            #elseif(attachment.isXls())
            <img src="#(CPATH)/static/commons/img/suffix/xls.png" style="width: 100%">
            #elseif(attachment.isPpt())
            <img src="#(CPATH)/static/commons/img/suffix/ppt.png" style="width: 100%">
            #elseif(attachment.isTxt())
            <img src="#(CPATH)/static/commons/img/suffix/txt.png" style="width: 100%">
            #elseif(attachment.isZip())
            <img src="#(CPATH)/static/commons/img/suffix/zip.png" style="width: 100%">
            #elseif(attachment.isRar())
            <img src="#(CPATH)/static/commons/img/suffix/rar.png" style="width: 100%">
            #elseif(attachment.isExe())
            <img src="#(CPATH)/static/commons/img/suffix/exe.png" style="width: 100%">
            #elseif(attachment.isPdf())
            <img src="#(CPATH)/static/commons/img/suffix/pdf.png" style="width: 100%">
            #elseif(attachment.isAudio())
            <img src="#(CPATH)/static/commons/img/suffix/audio.png" style="width: 100%">
            #elseif(attachment.isVideo())
            <img src="#(CPATH)/static/commons/img/suffix/video.png" style="width: 100%">
            #else
            <img src="#(CPATH)/static/commons/img/suffix/unknow.png" style="width: 100%">
            #end

        </div>
    </div>

    <div class="col-7" id="image-info" style="padding-left:20px;">


            <div class="jp-block">
                <div class="row jp-group">
                    <label class="col-2">文件名</label>
                    <p class="col-10">
                    #(attachment.title ??)
                    </p>
                </div>
                <div class="row jp-group">
                    <label class="col-2 ">文件类型</label>
                    <p class="col-10">
                    #(attachment.mime_type ??)（#(attachment.suffix ??)）
                    </p>
                </div>

                <div class="row jp-group">
                    <label class="col-2 ">上传于</label>
                    <p class="col-10">
                    #date(attachment.created ??)
                    </p>
                </div>

                <div class="row jp-group">
                    <label class="col-2 ">文件大小</label>
                    <p class="col-10">
                    #(attachmentSize ??)
                    </p>
                </div>

                <div class="row jp-group">
                    <label class="col-2">分辨率</label>
                    <p class="col-10">
                    #(attachmentRatio ??)
                    </p>
                </div>

            </div>

            <div>
                <form action="#(CPATH)/admin/attachment/doUpdate" id="form">
                    <input type="hidden" name="attachment.id" value="#(attachment.id ??)">
                    <div class="form-group row jp-group">
                        <label class="col-2">URL</label>
                        <input class="form-control col-10" readonly value="#(CPATH)#(attachment.path ??)"/>
                        <p class="text-muted offset-2"><a href="#(CPATH)#(attachment.path ??)" target="_blank">访问</a> </p>
                    </div>

                    <div class="form-group row jp-group">
                        <label class="col-2">文件名</label>
                        <input type="text" class="form-control col-10" name="attachment.title" value="#(attachment.title ??)">
                    </div>

                    <div class="form-group row jp-group">
                        <label class="col-2">描述</label>
                        <textarea class="form-control col-10" rows="3" name="attachment.description">#(attachment.description ??)</textarea>
                    </div>
                </form>
            </div>

            <div class="row">
                <div class="col-2"></div>
                <div class="col-10">
                    <a href="javascript:;" onclick="update()">保存</a>
                    <span>|</span>
                    <a href="javascript:;" onclick="del('#(attachment.id ??)')" style="color: #a00">彻底删除</a>
                </div>

            </div>

    </div>
</div>

#end
